<template>
  <div>
    <!--  填写国内运单号弹窗  -->
    <el-dialog
      title="填写采购信息"
      :visible.sync="isOpen"
      width="500px"
      :before-close="close">
      <el-form size="small" :model="form" :rules="rules" ref="formRef" label-width="120px">
        <el-form-item label="国内运单号：" prop="cnTrackingNo">
          <el-input v-model="form.cnTrackingNo" placeholder="请输入国内运单号"/>
        </el-form-item>
        <el-form-item label="采购价：" prop="purchasePrice">
          <el-input v-model="form.purchasePrice" placeholder="请输入采购价"/>
        </el-form-item>
        <el-form-item label="购买凭证：" prop="proof">
          <image-upload v-model="form.proof" :is-show-tip="false" width="50px" height="50px"/>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="close()">取 消</el-button>
        <el-button type="primary" @click="confirm()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {queryPurchaseInfo, uploadPurchaseInfo} from "@/api/order/orderApi";

export default {
  name: 'order-list',
  props: {
    orderId: {
      type: String / Number
    },
    childOrderId: {
      type: String / Number
    }
  },
  data() {
    return {
      isOpen: true,
      form: {},//国内运单号信息
      rules: { // 线上发货表单校验
        cnTrackingNo: [{required: true, message: '国内运单号不能为空', trigger: 'blur'}],
        purchasePrice: [{required: true, message: '采购价格不能为空', trigger: 'blur'}],
        proof: [{required: true, message: '请上传购买凭证', trigger: 'change'}],
      },
    }
  },
  mounted() {
    this.getSendGoodsInfo()
  },
  methods: {
    // 获取已上传的凭证和运单号信息
    getSendGoodsInfo() {
      queryPurchaseInfo({childOrderId: this.childOrderId}).then((res) => {
        console.log('res', res)
        if (res.data) {
          this.form = res.data
        } else {
          this.form = {
            cnTrackingNo: '',
            purchasePrice: '',
            proof: '',
          }
        }
      })
    },
    // 确定上传采购信息
    confirm() {
      this.form.childOrderId = this.childOrderId
      uploadPurchaseInfo(this.form).then(res => {
        this.$message.success(res.msg)
        this.close('1')
      })
    },
    // 关闭线上发货弹窗
    close(isRefresh) {
      this.$emit('close', isRefresh)
    },
  }
}
</script>
<style scoped>
.el-divider__text {
  font-size: 16px;
  font-weight: bold;
  color: #000;
}
</style>
